Skip to content

fix(bridge): remove redundant useElevatedSurface from Bridge modals (TMCU-1039)#33158

Closed
georgewrmarshall wants to merge 2 commits into
mainfrom
cursor/remove-elevated-surface-bridge-modals-5fb3
Closed

fix(bridge): remove redundant useElevatedSurface from Bridge modals (TMCU-1039)#33158
georgewrmarshall wants to merge 2 commits into
mainfrom
cursor/remove-elevated-surface-bridge-modals-5fb3

Conversation

@georgewrmarshall

Copy link
Copy Markdown
Contributor

Description

MMDS BottomSheet now applies the pure-black elevated surface internally, so Bridge modals no longer need the useElevatedSurface() shim (twClassName={surfaceClass}).

This PR removes the redundant hook import, surfaceClass variable, and twClassName prop from all eight Bridge-owned bottom sheet modals listed in TMCU-1039.

Changelog

CHANGELOG entry: null

Related issues

Fixes: https://consensyssoftware.atlassian.net/browse/TMCU-1039

Manual testing steps

N/A — mechanical cleanup only. BottomSheet already owns elevated-surface styling; no visual or behavioral logic changed beyond removing duplicate twClassName wiring.

Screenshots/Recordings

N/A — no visual change expected; elevated surface styling is now sourced solely from MMDS BottomSheet.

Before

N/A

After

N/A

Pre-merge author checklist

Performance checks (if applicable)

  • I've tested on Android
    • Ideally on a mid-range device; emulator is acceptable
  • I've tested with a power user scenario
    • Use these power-user SRPs to import wallets with many accounts and tokens
  • I've instrumented key operations with Sentry traces for production performance metrics

Pre-merge reviewer checklist

  • I've manually tested the PR (e.g. pull and build branch, run the app, test code being changed).
  • I confirm that this PR addresses all acceptance criteria described in the ticket it closes and includes the necessary testing evidence such as recordings and or screenshots.
Open in Web Open in Cursor 

MMDS BottomSheet now handles pure-black elevated surface internally.
Remove the useElevatedSurface shim (twClassName={surfaceClass}) from
all Bridge-owned bottom sheet modals per TMCU-1039.

Co-authored-by: George Marshall <georgewrmarshall@users.noreply.github.com>
@metamask-ci metamask-ci Bot added the team-design-system All issues relating to design system in Mobile label Jul 10, 2026
Co-authored-by: George Marshall <georgewrmarshall@users.noreply.github.com>
@github-actions

Copy link
Copy Markdown
Contributor

🔍 Smart E2E Test Selection

  • Selected E2E tags: SmokeSwap, SmokeConfirmations
  • Selected Performance tags: None (no tests recommended)
  • Risk Level: low
  • AI Confidence: 90%
click to see 🤖 AI reasoning details

E2E Test Selection:
All 8 changed files are Bridge/Swap UI modal components. The changes are uniform and minimal: removing the useElevatedSurface hook import, its usage, and the twClassName={surfaceClass} prop from BottomSheet components. This is a theming/visual change that removes an elevated surface styling from bottom sheet modals in the swap/bridge flow.

The affected components are:

  • BatchSellDestinationTokenSelectorModal, BatchSellFinalReviewModal, BatchSellMinimumReceivedInfoModal, BatchSellNetworkFeeInfoModal, BatchSellQuoteDetailsModal — all part of the batch sell (swap) flow
  • HighRateAlertModal, MissingPriceModal, PriceImpactModal — warning/info modals in the swap/bridge flow

These changes affect the swap/bridge user flow, so SmokeSwap is the primary tag. Per SmokeSwap's description, SmokeConfirmations should also be selected since swap flows involve transaction confirmations. No other flows (staking, accounts, network, browser, snaps, etc.) are affected. The changes are low risk — they remove a styling prop, not business logic — but should be validated to ensure the bottom sheets still render correctly without the elevated surface class.

Performance Test Selection:
The changes are purely UI/theming — removing a CSS class prop from BottomSheet components in swap/bridge modals. This has no meaningful impact on app performance metrics like render times, load times, or transaction execution speed. No performance tests are warranted.

View GitHub Actions results

@sonarqubecloud

Copy link
Copy Markdown

@georgewrmarshall georgewrmarshall self-assigned this Jul 13, 2026
@@ -106,7 +104,6 @@ export function BatchSellDestinationTokenSelectorModal() {
ref={sheetRef}
goBack={navigation.goBack}
testID={BatchSellDestinationTokenSelectorModalSelectorsIDs.SHEET}

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

MMDS BottomSheetDialog applies elevated surface styling internally since design-system-react-native 0.33, so twClassName={surfaceClass} was redundant at every Bridge modal callsite. useElevatedSurface returned bg-alternative in pure-black dark mode, matching what BottomSheetDialog now sets via usePureBlack. The other seven Bridge files in this PR are the same deletion with no additional behavior change.

@georgewrmarshall georgewrmarshall marked this pull request as ready for review July 14, 2026 21:08
@georgewrmarshall georgewrmarshall requested a review from a team as a code owner July 14, 2026 21:08
@georgewrmarshall georgewrmarshall marked this pull request as draft July 14, 2026 21:08
@github-actions github-actions Bot locked and limited conversation to collaborators Jul 14, 2026
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.

Labels

size-S team-design-system All issues relating to design system in Mobile

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants